<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>申请音乐人</title>
	<link rel="stylesheet" href="__ADDON__/front/css/reset.css">
	<link rel="stylesheet" href="__ADDON__/front/css/index4.css">
	<link rel="stylesheet" href="__ADDON__/front/css/swiper.min.css">

	<js href="__ADDON__/ajaxupload/js/jquery.js" />
	<js href="__ADDON__/ajaxupload/js/ajaxupload.js" />
	<link rel="stylesheet" href="/public/addon/style/css/bootstrap-select.css">
	<script src="/public/addon/style/js/bootstrap-select.min.js"></script>
	<script type="text/javascript">
        $(function(){
            var button = $('#upload_button'), interval;
            var confirmdiv = $('#uploadphotoconfirm');
            var fileType = "pic",fileNum = "one";
            new AjaxUpload(button,{
                action: "__APP__/Home/Upload/Image/Addon/AjaxUpload.html",
                name: 'userfile',
                onSubmit : function(file, ext){
                    if(fileType == "pic")
                    {
                        if (ext && /^(jpg|png|jpeg|gif|JPG)$/.test(ext)){
                            this.setData({
                                'info': '文件类型为图片'
                            });
                        } else {
                            confirmdiv.text('文件格式错误，请上传格式为.png .jpg .jpeg 的图片');
                            return false;
                        }
                    }

                    confirmdiv.text('文件上传中');

                    if(fileNum == 'one')
                        this.disable();

                    interval = window.setInterval(function(){
                        var text = confirmdiv.text();
                        if (text.length < 14){
                            confirmdiv.text(text + '.');
                        } else {
                            confirmdiv.text('文件上传中');
                        }
                    }, 200);
                },
                onComplete: function(file, response){
                    if(response != "success"){
                        if(response =='2'){
                            confirmdiv.text("文件格式错误，请上传格式为.png .jpg .jpeg 的图片");
                        }else{

                            confirmdiv.text("上传完成");

                            $("#newbikephotoName").val(response);
                            $("#newbikephoto").attr("src",response);
                            $("#imgurl").attr("value",response);

                        }

                    }

                    window.clearInterval(interval);

                    this.enable();

                    if(response == "success")
                        alert('上传成功');
                }
            });
        });
	</script>
	<style>

		#upload_button{position: relative}
		#newbikephoto{
			width: 100%;
			height: 100%;
			position: absolute;
			top: 0;
			left: 0;
		}
		#uploadphotoconfirm{display: none;}
	</style>
</head>
<body>
	<!-- 公共头部 -->
	<div class="headerWrap">
		<div class="header">
			<ul class="title">
				<li><a href="__APP__/Front/Index/index.html">首页</a></li>
				<li><a href="__APP__/Front/Index/down_client.html">下载客户端</a></li>
				<li><a href="__APP__/Front/Index/about_us.html">关于我们</a></li>
			</ul>
			<div class="login">
				<a class="showLogin">登录</a>/
				<a>申请音乐人</a>
			</div>
		</div>
	</div>
	<!-- 公共头部_end -->
	<div class="main">
		<div class="title">添加个人信息</div>
		<div class="infoBox">
			<div class="lineText">
				<div>
					<div>名称:</div>
				</div>
				<div>
					<input type="text" name="name" value="" id="name">
				</div>
			</div>
			<div  class="sex">
				<div>
					<div>性别:</div>
				</div>
				<div>
					<div>
						<input type="radio" name="sex" value="1" checked>男
					</div>
					<div>
						<input type="radio" name="sex" value="2">女
					</div>
					<div>
						<input type="radio" name="sex" value="3">团体
					</div>
				</div>
			</div>
			<div class="pic" style="position:relative">
				<div>
					<div>头像:</div>
				</div>
				<div id="upload_button">
					+
					<section style="position: absolute;width: 100%;height: 100%;top: 0;left: 0;">
						<label for="bike_type">&nbsp;</label>
						<input type="file" style="display:none" name="userfile">
						<input type="hidden" id="newbikephotoName" name="img" value="" />
						<input type="hidden" id="oldbikephotoName" value="" />
						<!--<div style="text-align:center;">-->
							<img  id="newbikephoto" src="/upload/0/2018/06/05/123.png" style="" />
							<span class="help-inline"></span>
							<br>
							<div id="uploadphotoconfirm"></div>
							<br>
							<input type="hidden" name="img" id="imgurl" value=""  >
							<!--<input type="button" style="width:88px;height:88px;" id="upload_button"  value="上传缩略图" /><br/>-->
						<!--</div>-->
					</section>
				</div>


			</div>
			<!--<div class="lineText">-->
				<!--<div>-->
					<!--<div>手机号:</div>-->
				<!--</div>-->
				<!--<div>-->
					<!--<input type="text" name="tel" id="tel">-->
				<!--</div>-->
			<!--</div>-->
			<div class="lineText">
				<div>
					<div>邮箱:</div>
				</div>
				<div>
					<input type="text" name="email" id="email">
				</div>
			</div>
			<div class="style">
				<div>
					<div>流派风格:</div>
				</div>
				<div>
					<volist name="style_list" id="style_list">
						<div>
							<input type="checkbox" name="style[]" value="{$style_list.id}">{$style_list.name}
						</div>
					</volist>
				</div>
			</div>
			<div class="lineText">
				<div>
					<div>证件号:</div>
				</div>
				<div>
					<input type="text" name="id_card" id="id_card">
				</div>
			</div>
			<div class="lineText">
				<div>
					<div>地区:</div>
				</div>
				<div>
					<select name="country" class="place" id="country">
						<option value="0">全部地区</option>
						<volist name="country_list" id="country_list">
							<option value="{$country_list.id}">{$country_list.name}</option>
						</volist>
					</select>
				</div>
			</div>
			<div class="lineText">
				<div>
					<div>国籍:</div>
				</div>
				<div>
					<input type="text" name="native_place" id="native_place">
				</div>
			</div>
			<div class="lineText">
				<div>
					<div>所属公司/厂牌:</div>
				</div>
				<div>
					<input type="text" name="province" id="province">
				</div>
			</div>
			<div class="introduce">
				<div>
					<div>介绍:</div>
				</div>
				<div>
					<textarea name="intro" id="intro"></textarea>
				</div>
			</div>
			<button class="btn" onclick="change()">提交</button>
		</div>
	</div>

	<div class="empty"></div>

<!-- 登录框 -->
	<include file="index/login" />
		<!-- 登录框_end -->
</body>
<script src="__ADDON__/front/js/jquery.min.js"></script>
<script src="__ADDON__/front/js/swiper.min.js"></script>
<script src="__ADDON__/front/js/index.js"></script>
<script src="http://static.hongdayun.com/public/layer/2.2/layer.js"></script>
<script src="http://static.hongdayun.com/public/layDate/1.1/laydate.js"></script>
<script>

    function change(){
        obj = document.getElementsByName("style[]");
        check_val = [];
        for(k in obj){
            if(obj[k].checked)
                check_val.push(obj[k].value);
        }

        var nickname = $("#name").val();    //昵称
        var sex = $('input[name="sex"]:checked').val();			    //性别
        var img = $("#newbikephotoName").val();
        var email = $("#email").val();
        var style = check_val;         //风格
        var id_card = $("#id_card").val();	            //身份证
        var country =  $("#country").val();		     //地区
        var native_place = $("#native_place").val();         //国籍
        var province = $("#province").val();         //所属公司/厂牌
        var intro = $("#intro").val();	            //介绍

        if(nickname == ''){
            layer.msg("昵称不能为空，请填写昵称");
            document.getElementById("name").focus();
            return false;
        }
        if(style == null){
            layer.msg("请选择风格");

            return false;
        }

        if(intro == ''){
            layer.msg("介绍不能为空，请填写介绍");
            document.getElementById("intro").focus();
            return false;
        }

        $.ajax({
            type:'POST',
            url:"__APP__/Front/Index/person_info.html",
            data:{
                "nickname": nickname,
                "sex": sex,
                "country": country,
                "native_place": native_place,
                "style": style,
                "province": province,
                "intro": intro,
                "id_card": id_card,
                "email": email,
                "img": img,
            },
            success:function(data){
                var info = eval(data)
                if (info.errcode == 0) {

                    layer.msg(info.errmsg);
                    setTimeout(window.location.reload(),3000);

                }else{
                    layer.msg(info.errmsg);
                }
            },
            error:function(){
                layer.msg('系统繁忙,请稍候重试！');
            }

        });
    }

</script>
<include file="index/MyScript" />
</html>